import {  Card ,Table} from 'antd';
import { connect} from 'umi';
import React, {useEffect} from 'react';
import { GridContent } from '@ant-design/pro-layout';

const columns = [
  {
    title: '课程名称',
    dataIndex: 'courseName',
  },
  {
    title: '上课时间',
    dataIndex: 'openingTime',
  },
  {
    title: '课时类型',
    dataIndex: 'type',
    render: val => val=='1'?'团课':val=='2'?'小班课':val=='3'?'私教课':'未设置',
  },
  {
    title: '教练',
    dataIndex: 'name',
  },
  {
    title: '课时价格',
    dataIndex: 'classHour',
  },
  {
    title: '状态',
    dataIndex: 'status',
  },
  {
    title: '备注',
    dataIndex: 'zb',
  },
];
const Info = props => {
  const { dispatch, id,courseRecord,loading} = props
  useEffect(() => {
    if (dispatch) {
      dispatch({
        type: 'cubeVip/fetchCourse',
        payload: {
          memberId:id
        },
      })
     }
   }, []);
  return (
    <GridContent>
            <Card
              title="预课记录"
              style={{
                marginBottom: 24,
              }}
              bordered={false}
            >
               <Table
                pagination={false}
                loading={loading}
                dataSource={courseRecord}
                columns={columns}
              />
            </Card>
          </GridContent>
  );
};

export default connect(({ loading,cubeVip }) => ({
  loading: loading.effects['cubeVip/fetchCourse'],
  courseRecord:cubeVip.courseRecord
}))(Info);
